<!--  -->
<template>
  <div>子组件
 
    <slot :list="list"></slot>

     <div class="search">
        <slot name="search"></slot>
     </div>
     <div class="table">
        <slot :list="list" name="table"></slot>
     </div>
     <div class="page">
         <slot name="page"></slot>
     </div>
  </div>
</template>

<script lang='ts' setup>
import { reactive,toRefs,ref,onMounted} from 'vue'

const list=ref(["a","b","c"])
</script>
<style scoped>

.search{
    width: 100%;
    height:100px;
    background: skyblue;
}
.table{
    width: 100%;
    height:100px;
    background: sandybrown;
}
.page{
    width: 100%;
    height:100px;
    background: blue;
}
</style>